<template>
  <div class="center-energy-report">
    <dv-loading v-if="loading"></dv-loading>
    <Coldwatercompare
      v-else
      :listData="listData"
      :ColdWatercopData="ColdWatercopData"
      @ConfirmQuery="confirmQuery"
      @ChangeDate="changeDate"
    />
  </div>
</template>
<script>
import Coldwatercompare from "../../components/coldwatercompare/Coldwatercompare.vue";
import {
  searchColeWatersbt, //根据车站名查询冷水机的状态和运行时间
  searchColeWatercop, //cop和耗电量曲线
} from "../../api/base8090.js";
import { getLastWeekArr } from "../../utils/mytime.js";
import { mapState } from "vuex";
export default {
  name: "coldwatercompare",
  components: {
    Coldwatercompare,
  },
  created() {
    this.timer = setInterval(() => {
      if (document.readyState === "complete") {
        this.loading = false;
        window.clearInterval(this.timer);
      }
    }, 1000);
    this.initData();
  },
  data() {
    return {
      loading: true,
      timer: null,
      queryParmas: {
        stationCode: sessionStorage.getItem("stationCode"),
      },
      queryData: {
        stationCode: sessionStorage.getItem("stationCode"),
        startTime: getLastWeekArr()[0],
        endTime: getLastWeekArr()[1],
      },
      listData: [],
      ColdWatercopData: [],
    };
  },
  methods: {
    initData() {
      this.listData = [];
      this.ColdWatercopData = [];

      searchColeWatersbt(this.queryParmas).then((res) => {
        if (res.code == 200) {
          this.listData = res.data;
        }
      });
      searchColeWatercop(this.queryData).then((res) => {
        if (res.code == 200) {
          this.ColdWatercopData = res.data;
        }
      });
    },
    changeDate(date) {
      this.queryData.startTime = date[0];
      this.queryData.endTime = date[1];
    },
    confirmQuery() {
      searchColeWatercop(this.queryData).then((res) => {
        if (res.code == 200) {
          this.ColdWatercopData = res.data;
        }
      });
    },
  },
  computed: {
    ...mapState(["stationCode"]),
  },
  watch: {
    stationCode(newVal, oldVal) {
      if (newVal != oldVal) {
        this.queryParmas.stationCode = newVal;
        this.queryData.stationCode = newVal;
        this.initData();
      }
    },
  },
};
</script>
<style lang="less" scoped>
.center-energy-report {
  width: 100%;
  height: 100%;
}
</style>
